<template>
  <view class="container">
	  <!-- <uni-nav-bar shadow statusBar="true" fixed="true" left-icon="left" @clickLeft="goBack()" leftText="返回"  title="员工管理" /> -->
    <view class="example">
		<uni-list :border="true">
			<uni-swipe-action>
				<!-- 显示圆形头像 -->
				
				<!--  link :to="`/pages/work/emp/bind?user=`+decodeURIComponent(JSON.stringify(item.userId))" -->
				<uni-swipe-action-item :right-options="options"  v-for="(item, index) in dataList" @click="onClick($event,index,item)">
					<uni-list-chat
              :avatar-circle="true"
			  :title="item.nickName"
			  :note="item.userName"
			  :avatar="item.avatar?'item.avatar':static_url+'profile.jpg'"
              :time="item.phonenumber"
			  link :to="`/pagesA/work/emp/edit?user=`+decodeURIComponent(JSON.stringify(item))">
          </uni-list-chat>
				</uni-swipe-action-item>
			</uni-swipe-action>
		</uni-list>
    </view>
	<uni-fab ref="fab" :pattern="pattern"   horizontal="right" vertical="bottom"
				  @fabClick="goAdd()" />
	<uni-load-more :status="status" @clickLoadMore="onBottom()" :content-text="contentText"></uni-load-more>
  </view>
</template>

<script>
  import {
  	getUserList,delUser
  } from '@/api/system/user';
  import { updateUserProfile } from "@/api/system/user"
import { login } from '../../../api/login';

  export default {
    data() {
      return {
        static_url: getApp().globalData.config.appInfo.static_image_url,
        options: [
			{
			    text: '换卡',
			    style: {
			        backgroundColor: '#007aff'
			    }
			},{
            text: '删除',
            style: {
              backgroundColor: '#dd524d'
            }
          }
        ],
        status: 'more',
        total: 0,
		  contentText: {
		  					contentdown: '查看更多',
		  					contentrefresh: '加载中',
		  					contentnomore: '没有更多'
		  				},
		  listQuery:{
			pageNum:0,
			pageSize:10,
			orderByColumn:'createTime',
			isAsc:'desc',
		  	userType:'2',
		  	companyId:this.$store.getters.companyId
		  },
		  pattern: {
		  					color: '#7A7E83',
		  					backgroundColor: '#fff',
		  					selectedColor: '#007AFF',
		  					buttonColor: '#007AFF',
		  					iconColor: '#fff'
		  				},
		  dataList: [],

      }
    },
    onLoad() {
      // this.getUser()
    },
	onShow(){
		this.listQuery.pageNum=0
		this.status = 'more'
		this.dataList = []
		this.getUser()
	},
	onBackPress() {
		uni.switchTab({
		  url:"/pages/work/index"
		 })
	},
	onReachBottom() {
		
		let limit = this.listQuery.pageNum * this.listQuery.pageSize
		if(this.total>limit){
			this.getUser()
		}
	},
	async onPullDownRefresh() {
		this.listQuery.pageNum=0
		this.status = 'more'
		this.dataList = []
		this.getUser()
		setTimeout(()=>{
			uni.stopPullDownRefresh()
		},1000)
		
	},
    onReady() {
      // this.$refs.form.setRules(this.rules)
    },
    methods: {
		onClick(event,index,item){
			if(event && event.content.text==='删除') {
				uni.showModal({
					title: '提示',
					content: '是否删除',
					success: res => {
						if (res.confirm) {
							delUser(item.userId).then(()=>{
								this.dataList.splice(index, 1);
							})
						} else if (res.cancel) {
							
						}
					}
				});
			}else if(event.content.text==='换卡'){
				this.$tab.navigateTo(`/pagesA/work/emp/bindchange?user=`+decodeURIComponent(JSON.stringify(item)))
			}
		    
		},
		onBottom() {
			let limit = this.listQuery.pageNum * this.listQuery.pageSize
			if(this.total>limit){
				this.getUser()
			}
		},
		
		//获取列表数据
       getUser() {
		  this.listQuery.pageNum = this.listQuery.pageNum+1;
		  this.status = 'loading'
		  uni.showLoading()
        getUserList(this.listQuery).then(response => {
			uni.hideLoading()
			this.total = response.total
			let resultData = response.rows
			for (let i = 0; i < resultData.length; i++) {
			    this.dataList.push(resultData[i]);
			}
          // 判断总条数如果是最大则改为没有更多
		  if (this.dataList.length >= response.total) {
			  this.status = 'no-more';
		    }else{
				this.status = 'more';
			}
        })
      },
	  goBack(){
		  this.$tab.navigateBack()
	  },
	  goAdd(){
		  this.$tab.navigateTo('/pagesA/work/emp/addUser')
	  },
    }
  }
</script>

<style>
	page {
		background-color: #ffffff;
		height:101%;
	}
</style>

<style lang="scss" scoped>
  .example {
    // padding: 15px;
    background-color: #fff;
  }

  .segmented-control {
    margin-bottom: 15px;
  }

  .button-group {
    margin-top: 15px;
    display: flex;
    justify-content: space-around;
  }

  .form-item {
    display: flex;
    align-items: center;
    flex: 1;
  }

  .button {
    display: flex;
    align-items: center;
    height: 35px;
    line-height: 35px;
    margin-left: 10px;
  }
  /deep/.uni-fab__circle {
	  width: 40px;
	  height: 40px;  
  }
</style>
